<?php echo $header; ?>
	<div class="row">
			<div id="color-banner" align="center">
				<p id="banner-small">
				<?php foreach ($breadcrumbs as $breadcrumb) { ?>
				<?php echo $breadcrumb['separator']; ?><a href="<?php echo $breadcrumb['href']; ?>"><?php echo $breadcrumb['text']; ?></a>
				<?php } ?>
				<a id="pagetitlehref" style="display:none" href="<?php echo $breadcrumbs[count($breadcrumbs)-1]['href']; ?>"></a>
				</p>
				<p id="banner-big" ><?php echo $heading_title; ?></p>
			</div>

	</div>
	<div id="alt-filter" class="row show-for-small">
		<div class="columns">
			<div id="filter-navigator">
				
			</div>
			<div id="roll-filter">
				<table width="100%">
					<tr>
						<td width="50%">
							<div id="alt-filter-box">
							
							</div>
						</td>
						<td>
							<div id="alt-filter-age">
							
							</div>
						</td>
					</tr>
				</table>
			</div>
		</div>
	</div>
	<script> <!-- for alt-filter -->
		$(document).ready(function() {
			$('#alt-filter-box').html($('#filter-group').html());
			$('#alt-filter-age').html($('#filter-age').html());
			
			$('#filter-navigator').click(function() {
				if ($('#roll-filter').css('display') == 'none') {
					openRollFilter();
				} else {
					closeRollFilter();
				}
			});
			$('#roll-filter ul li ul li a').click(function() {
				closeRollFilter();
			});
			function openRollFilter() {
				$('#roll-filter').fadeIn();
			}
			function closeRollFilter() {
				$('#roll-filter').fadeOut();
			}
		});
	</script>

<div class="row">
	<?php echo $column_left; ?><?php echo $column_right; ?>
		<!--If this is categories -->
		<?php if ($categories) { ?>
		<h2><?php echo $text_refine; ?></h2>
		<div class="category-list">
			<?php if (count($categories) <= 5) { ?>
			<ul>
				<?php foreach ($categories as $category) { ?>
				<li><a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a></li>
				<?php } ?>
			</ul>
			<?php } else { ?>
			<?php for ($i = 0; $i < count($categories);) { ?>
			<ul>
				<?php $j = $i + ceil(count($categories) / 4); ?>
				<?php for (; $i < $j; $i++) { ?>
				<?php if (isset($categories[$i])) { ?>
				<li><a href="<?php echo $categories[$i]['href']; ?>"><?php echo $categories[$i]['name']; ?></a></li>
				<?php } ?>
				<?php } ?>
			</ul>
			<?php } ?>
			<?php } ?>
		</div>
		<?php } ?>
		<?php if ($products) { ?>
		<div class="small-12 large-9 columns">
			<div class="breadcrumb">
				<p>
				<?php echo $pagination; ?>
				</p>
			</div>

			<ul class="small-block-grid-2 large-block-grid-4">
			<?php foreach ($products as $product) { ?>
				<li>
					<a href="<?php echo $product['href']; ?>">
						<div class="panel1">
							<img src="<?php echo $product['thumb']; ?>" title="<?php echo $product['name']; ?>" alt="<?php echo $product['name']; ?>">
						</div>
						<div class="panel2">
							<div class="productdetail">
								<div class="productname">
									<?php echo $product['name']; ?>
								</div>
								<div class="productdescription">
									<?php echo $product['description']; ?>
								</div>
								<div class="productprice">
									<?php echo $product['price']; ?>
								</div>
								<div class="productprice">
									<?php echo $product['special']; ?>
								</div>
							</div>
						</div>	
					</a>
				</li>
			<?php } ?>
			</ul>
			<div class="breadcrumb hide-for-small">
				<p>
				<?php echo $pagination; ?>
				</p>
				<script>
					$('.results').hide();
					$('.links').html($('.links').html() + $('.results').html());
					$('.hide-for-small .links ').html($('.hide-for-small .links').html() + ' <span id="totop"><a href="#">Go to top</a></span>');
					
				</script>
			</div>
			<div class="breadcrumb show-for-small">
				<p>
					<span id="alt-totop"><a href="#">Go to top</a></span>
				</p>					
			</div>
		</div>
		<?php } ?>
		<?php if (!$categories && !$products) { ?>
		<div class="content"><?php echo $text_empty; ?></div>
		<div class="buttons">
			<div class="right"><a href="<?php echo $continue; ?>" class="button"><?php echo $button_continue; ?></a></div>
		</div>
		<?php } ?>
		<?php echo $content_bottom; ?></div>

<?php echo $footer; ?>